<template>
	<view class="">
		<itemBar :usedGoodsList="classificationUsedGoodsInfos" url="./itemDetails"></itemBar>
	</view>
</template>

<script>
	import itemBar from "../components/itemBar";
	import {
		mapActions,
		mapState
	} from "vuex"
	export default {
		name: "classificationList",

		data() {
			return {
				classificationTitle: '',
				size: 1,		// 懒加载页码
			}
		},

		onLoad(option) {
			
			this.classificationTitle = option.classificationTitle
			
			// 获取分类物品信息
			this.getClassificationUsedGoodsInfos({
				size: this.size,
				articlesType: this.classificationTitle,
				token: this.token
			})
			
			// 设置新导航栏标题
			uni.setNavigationBarTitle({
				title: this.classificationTitle
			});
		},
		
		computed: {
			...mapState('usedGoodsModule', ["classificationUsedGoodsInfos"]),
			...mapState('publicModule', ["token"])
		},

		methods: {
			...mapActions('usedGoodsModule', ["getClassificationUsedGoodsInfos"])
		},

		components: {
			itemBar
		},
		
		// 下拉刷新
		onPullDownRefresh() {
			console.log('分类下拉刷新')
			// 刷新分类列表
			this.getClassificationUsedGoodsInfos({
				size: this.size,
				articlesType: this.classificationTitle,
				token: this.token
			})
			
			// 停止并隐藏下拉刷新的loading组件
			uni.stopPullDownRefresh()
		},
		
		// 上拉触底
		onReachBottom() {
			this.size++;
			this.getClassificationUsedGoodsInfos({
				size: this.size,
				articlesType: this.classificationTitle,
				token: this.token
			})
		},
		
	}
</script>

<style scoped>

</style>